<template>
	<view class="content">
		<titleTop @selCourse="getCourse" :currCourse="currCourse"></titleTop>
		<!-- 轮播图 -->
		<swiper>
			<swiper-item>
				<image src="../../static/icon_short_hand_banner.png" mode="widthFix"></image>
			</swiper-item>
			<swiper-item>
				<image src="../../static/icon_short_hand_banner.png" mode="widthFix"></image>
			</swiper-item>
		</swiper>
		<!-- 消息 -->
		<view class="active_div">
			<image class="active_img1" src="../../static/jft_img_headlines.png"></image>
			<image class="active_img2" src="../../static/jft_icon_notice1.png"></image>
			<text class="active_text">今天该期末考试啦</text>
		</view>
		<!--图标 -->
		<view class="icon_div">
			<navigator class="icon_item" url="../mycourse/mycourse" hover-class="navigator-hover">
				<image src="../../static/btn_fxmoney_j.png"></image>
				<view>我的课程</view>
			</navigator>

			<navigator class="icon_item" url="../chapterlist/chapterlist"
			 hover-class="navigator-hover">
				<image src="../../static/btn_fxmoney_quan.png"></image>
				<view>章节练习</view>
			</navigator>

			<view class="icon_item"
			      @click="showNum">
				<image src="../../static/jft_but_businesscooperation.png"></image>
				<view>每日一练</view>
			</view>

			<navigator class="icon_item"
			url="../noteList/noteList"
			 hover-class="navigator-hover">
				<image src="../../static/jft_but_myapplication.png"></image>
				<view>学生笔记</view>
			</navigator>
		</view>

		<!-- 选择课程弹窗 -->
		<view class="bottom_div" v-show="bottomSHow">
			<list>
				<cell v-for="(item,index) in courseList" :key="index" @tap="courseItemClicks(index)">
					{{item.name}}
				</cell>
				<cell>
						<!-- 因为最后一个不显示加个空标签 -->
				</cell>
			</list>
 
		</view>
<testNum v-if="numShow" :numList="numList" @selNum="selNum"></testNum>
	</view>
</template>

<script>
	import titleTop from '../../components/title/title.vue';
	import testNum from '../../components/setTestNum/setTestNum.vue'
	export default {
		components: {
			titleTop,
			testNum
		},
		data() {
			return {
				title: 'Hello',
				bottomSHow: false, //是否显示选择课程
				currCourse: "", //当前课程
				courseList: [], //课程数据
              numList:[10,30,50,100],//每日一练选择多少个题
				numShow:false,//是否弹出选择练题条数窗口
			}
		},
		onLoad() {
			
			//获取当前课程
			this.getUserInfo();
			//获取课程
			uni.request({
				url: this.baseUrl+'getCourseByStuId', //仅为示例，并非真实接口地址。
				method:'POST',
				data: {
					stuId: uni.getStorageSync('uid')
				},
				header: {
					'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
				},
				success: (res) => {
					this.courseList=res.data.courseEntity;
					console.log(this.courseList);
				}
			});
			
		},
		methods: { 
			getCourse: function() { 
				this.bottomSHow = true;
			},
			courseItemClicks: function(index) {
				this.currCourse = this.courseList[index].name;
				//把当前选择的课程存起来
				uni.setStorageSync('cid',this.courseList[index].id);
				uni.setStorageSync('cname',this.courseList[index].name);
				this.bottomSHow = false;
			},
			selNum:function(num){
				//获取每日一练选择了多少道题
				this.numShow=false;
				uni.navigateTo({
					url:'../testDay/testDay?num='+num
				})
				
			},
			showNum:function(){
				console.log("hah");
				this.numShow=true;
				
			},
			getUserInfo:function(){
				var uid=uni.getStorageSync('uid');
				var that=this;
				uni.request({
					url:this.baseUrl + 'student/getStudent',
					method: 'GET',
					data:{
						'stuId':uid
					},
					header: {
						'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
					},
					success: (res) => {						
						that.currCourse=res.data.data.courseName;
						//把当前选择的课程存起来
						uni.setStorageSync('cid',res.data.data.courseId);
						uni.setStorageSync('cname',res.data.data.courseName);
						
					}
				})
			}
		}
	}
</script>

<style>
	swiper {
		width: 100%;
		height: 364rpx;
	}

	swiper swiper-item image {
		width: 100%;
	}

	.active_div {
		background: #FFFFFF;
		height: 96rpx;
		display: flex;
		align-items: center;
		padding-left: 30rpx;

	}

	.active_div .active_img1 {
		height: 38rpx;
		flex: 1;
		padding-right: 20rpx;
		border-right: 1rpx solid #dadada;
	}

	.active_div .active_img2 {
		height: 38rpx;
		width: 30rpx;
		margin-left: 20rpx;
	}

	.active_text {
		flex: 10;
		height: 96rpx;
		line-height: 96rpx;
		margin-left: 20rpx;
		color: #666666;
		font-size: 28rpx;
	}

	.icon_div {
		display: flex;
		justify-content: space-between;
		background: #FFFFFF;
		margin-top: 20rpx;
	}

	.icon_div .icon_item {
		flex: 1;
		text-align: center;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		color: #666666;
		font-size: 24rpx;

	}

	.icon_div .icon_item image {
		width: 80rpx;
		height: 80rpx;
		margin-bottom: 15rpx;
	}

	.bottom_div {
		background: rgba(0, 0, 0, 0.5);
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;

	}

	.bottom_div list {
		position: absolute;
		bottom: 0;
		width: 100%;
		display: flex;
		background: #FFFFFF;
		flex-direction: column;
	}

	.bottom_div list cell {
		text-align: center;
		height: 88rpx;
		border-bottom: 1px solid #DADADA;
		line-height: 88rpx;

	}
</style>
